.essential-theme {
  h1 {
    font-weight: 300;
    font-size: 3.2rem;
    color: map-get($colors, is-text-dark);
  }

  p, .card-md p, .card-ios p {
    color: map-get($colors, is-mute-dark);
    font-weight: 300;
    a {
      color: map-get($colors, primary);
      text-decoration: none;
      font-weight: 400;
    }
  }

  .is-event-details-span {
    color: map-get($colors, is-mute-dark);
  }

  .is-hero {

    text-align: center;

    .is-image-container {
      position: relative;
      padding-bottom: 30px;

      img {
        width: auto;
        margin: auto;
        display: block;
      }

      h1 {
        position:absolute;
        top:20%;
        width: 100%;
      }
    }

    > h1 {
      padding: 30px 30px 0px 30px;
    }

    > p {
      padding: 0px 30px 30px 30px;
    }
  }

  button[ion-button], button.is-list-button-single  {
    border-radius: 5px;
  }

  .is-chevron-light {
    .item-ios[detail-push] .item-inner,
    button.item-ios:not([detail-none]) .item-inner,
    a.item-ios:not([detail-none]) .item-inner {
      background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2020'><path%20d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z'%20fill='%23ffffff'/></svg>");
    }

    .is-chevron-android {
      font-size: 1.4em;
    }
  }

  .is-chevron-dark {
    .item-ios[detail-push] .item-inner,
    button.item-ios:not([detail-none]) .item-inner,
    a.item-ios:not([detail-none]) .item-inner {
      background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2020'><path%20d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z'%20fill='%23AFB8BB'/></svg>");
    }

    .is-chevron-android {
      font-size: 1.4em;
      color:  map-get($colors, is-mute-normal);
    }
  }

  .is-facebook-icon {
    color: $facebook-color;
  }

  .is-twitter-icon {
    color: $twitter-color;
  }

  .is-linkedin-icon {
    color: $linkedin-color;
  }

  .is-background-primary {
    background-color: map-get($colors, primary);
  }

  .is-background-success {
    background-color: map-get($colors, success);
  }

  .is-background-secondary {
    background-color: map-get($colors, secondary);
  }

  .is-background-dark {
    background-color: map-get($colors, dark);
  }

  .is-background-light {
    background-color: color($colors, light, base);
  }

  .is-background-danger {
    background-color: color($colors, danger);
  }

  .is-color-primary {
    color: map-get($colors, primary) !important;
  }

  .is-color-light {
    color: color($colors, light, base) !important;
  }

  .is-color-secondary {
    color: color($colors, secondary) !important;
  }

  .is-color-success {
    color: color($colors, success) !important;
  }

  .is-color-danger {
    color: color($colors, danger) !important;
  }



  .is-tile {
    div {
      padding: 16px;

      h6 {
        margin-top: 2.6rem;
      }

      p {
        font-weight: lighter;
      }
    }

    ion-icon {
      font-size: 2.4em;
    }
  }

  .is-tile-colored {
    div {
      border-radius: 5px;
    }

    .is-tile-text {
      color: white;
    }

    ion-icon {
      color: white;
    }
  }

  .is-tile-bordered {
    div {
      border: 1px solid map-get($colors, is-mute-light);
      border-radius: 5px;
      height: 100%;
    }
  }

  .is-no-chevron {
    button.item-ios:not([detail-none]) .item-inner {
      background-image: none;
      padding-right: 8px;
    }
  }

  .is-mail-body {
    font-size: 1.6rem;
  }

  .searchbar-ios {
    background: $searchbar-color;
  }

  .is-profile-picture {
		display: flex;
		justify-content: center;
    position: relative;

    img {
      border-radius: 50%;
      height: 120px;
    }

    div {
      width: 140px;
      height: 120px;
      position: absolute;
      bottom: 0px;

      ion-fab {
        position: absolute;
        bottom: 0px;
        right: 0px;

        button {
          background-color: white;
          color: map-get($colors, is-mute-normal);
          border: 1px solid map-get($colors, is-mute-light);
        }
      }
    }
	}

  .is-profile-picture + div {
    h2 {
      color: map-get($colors, is-text-dark);
      font-weight: 300;
    }

    p {
      color: map-get($colors, success);
    }
  }

  .is-hero-product-category-info {
    h1 {
      margin-top: 0;
    }

    h6 {
      margin: 0;
      color: map-get($colors, success);
      text-transform: uppercase;
      font-size: 11px;
    }

    ion-col[col-4] div {
      height: 60px;
      width: 60px;
      border-radius: 50%;
      background-color: color($colors, light, base);
      display: flex;
      align-items: center;
      justify-content: center;

      ion-icon {
        color: white;
        font-size: 30px;
      }
    }
  }

  .is-slider-page {
    height: 100%;
    ion-slide.swiper-slide {
      align-items: start;
    }
  }


}
